<template>
<!-- 注册页面 -->
	<div class="container">
		<van-nav-bar
			fixed
			title="注册账号"
			@click-left="$router.back()"
			left-arrow
		/>

    <div class="logo-txt">
      欢迎注册
    </div>
		<van-form @submit="onSubmit" label-width="70px">
			<van-field
				v-model="username"
				name="用户名"
				label="用户名"
				placeholder="请输入手机号"
        left-icon="manager"
				:rules="[{ required: true, message: '请填写用户名' }]"
			/>
			<van-field
				v-model="password"
				type="password"
				name="密码"
				label="密码"
				placeholder="密码"
        left-icon="lock"
				:rules="[{ required: true, message: '请填写密码' }]"
			/>
      <van-field
				v-model="password"
				type="password"
				name="密码"
				label="确认密码"
				placeholder="确认密码"
        left-icon="lock"
				:rules="[{ required: true, message: '请填写密码' }]"
			/>
			<div style="margin: 16px">
				<van-button round block type="info" native-type="submit"
					>立即注册</van-button
				>
			</div>
		</van-form>
	</div>
</template>

<script>
import register from "@/api/user"
export default {
	data() {
		return {
			username: '',
			password: '',
		}
	},
	methods: {
	async	onSubmit(values) {
			console.log('submit', values)
			// 往后台发送注册请求
await register(values)
alert ('注册成功')
this.$router.push('/login')//导航到登录页面  编程式导航 此外还可以用$router.replace
	this.$toast('注册成功')
	},
	},
}
</script>

<style scoped>
.logo-txt{
  text-align:center;
  font-size: 60px;
  margin: 60px auto;
  color: #1989fa;
}
</style>
